<template>
    <div id="comb_view">
        <div id="game_222" class="game_view">
            <table class="u-table2">
                <thead>
                <tr>
                    <th colspan="12" style="display:none">头尾数</th>
                </tr>
                <tr>
                    <th style="width: 4%;">种类</th>
                    <th style="width: 6%;">赔率</th>
                    <th style="width: 8%;">金额</th>
                    <th style="width: 4%;">种类</th>
                    <th style="width: 6%;">赔率</th>
                    <th style="width: 8%;">金额</th>
                    <th style="width: 4%;">种类</th>
                    <th style="width: 6%;">赔率</th>
                    <th style="width: 8%;">金额</th>
                </tr>
                </thead>
                <tbody>
                    <TrItem :key="i" v-for="(row,i) in list[0]" :row="row" :bet-number="betNumber" :show-numbers="false" ></TrItem>
                </tbody>
            </table>
        </div>
    </div>
</template>

<script>
    import TrItem from "../components/TrItem";
    import {mapState} from "vuex";
    export default {
        name: "TeMaWeiShu",
        components:{TrItem},
        data(){
            return{
                list:[
                    [
                        [
                            {name:'0尾',bet:11.5,amount:'',selected:false,hovering:false},
                            {name:'5尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'0头',bet:5.1,amount:'',selected:false,hovering:false}
                        ],
                        [
                            {name:'1尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'6尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'1头',bet:4.6,amount:'',selected:false,hovering:false}
                        ],
                        [
                            {name:'2尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'7尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'2头',bet:4.6,amount:'',selected:false,hovering:false}
                        ],
                        [
                            {name:'3尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'8尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'3头',bet:4.6,amount:'',selected:false,hovering:false}
                        ],
                        [
                            {name:'4尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'9尾',bet:9.2,amount:'',selected:false,hovering:false},
                            {name:'4头',bet:4.6,amount:'',selected:false,hovering:false}
                        ]
                    ]
                ]
            }
        },
        computed:{
            ...mapState(['betNumber'])
        },
        watch:{
            betNumber(nVal){
                this.list.forEach((arr)=>{
                    arr.forEach((item)=>{
                        item.forEach((o)=>{
                            if (o.selected) {
                                o.amount = nVal
                            }
                        })
                    })
                })
                this.$forceUpdate()
            }
        },
    }
</script>

<style scoped>

</style>